<template>
	<view class="navbox">
		<view class="viewitem" v-for="(item,index) in navList" :key="index">
		<view @click="gother(item.id)" class="viewitem">
			<image :src="item.img" class="navimg"></image>
			<text class="navtext">{{item.text}}</text>
		</view>
		</view>
	</view>
</template>

<script>
	import goods from '@/json/goods.json'
	export default {
		data() {
			return {
				navList: [] //导航数组
			}
		},
		methods: {
gother(id){
	// console.log(id)
	switch(id){
		case 4:
		console.log(id)
		uni.navigateTo({
			url:'/pagesA/shoppingcart/shoppingcart'
		})
	}
}
		},
		created() {
			this.navList = goods.navlist
			// console.log(this.navList)
		}
	}
</script>

<style>
	.navbox {
		display: flex;
		justify-content: space-around;
		margin: 40px 0 20px;
	}

	.viewitem {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.navimg {
		width: 40px;
		height: 40px;
	}
	.navtext{font-size: 14px;margin-top: 4px;}
</style>
